<template>
<div class="box">
        <div class="head">
            <i class="el-icon-arrow-left"></i>
            <a>逗趣话题</a>
            <i  class="el-icon-more"></i> 
        </div>
        <div class="head_buluo">
           <img src="../assets/images/tou.png" alt=""> 
           <a href="#">阴阳师手游部落</a> 
            <i class="el-icon-arrow-right"></i>
        </div>

        <div class="head_buluo_tou">
            <h3>阴阳师美图一张</h3>
            <img src="../assets/images/tou.png" alt="">
            <div>
                <span>美美的鸟姑姑~</span>
                <p>2017-11-12</p>
            </div>
        </div>
        <div class="head_buluo_img">
            <h3>鸟姐郑楼~</h3>
            <img src="../assets/images/ht.gif" alt="">
        </div>
        <div class="hui">
            <p>评论(29182918)</p>
        </div>
         <div class="head_buluo_tou">
            <h3>阴阳师美图一张</h3>
            <img src="../assets/images/tou.png" alt="">
            <div>
                <span>美美的鸟姑姑~</span>
                <p>2017-11-12</p>
            </div>
        </div>
        <el-input v-model="input" placeholder="发表言论"></el-input>  
</div>
</template>
<script>
export default{
    name:'topic',
    data(){
        return{

        }
    },
      methods:{
            back(){
                this.$router.go(-1);
            }
        }
}  
</script>
<style lang="less" scoped>
a{
    text-decoration: none;
}
.box .el-icon-arrow-left{
    font-size: 20/35rem;
}
.head{
   border-bottom: 1/35rem solid gray;
    background:#ffffff;
}
 .head a{
    font-size: 20/35rem;
  	margin-left:110/35rem;
}
.el-icon-more{
    float:right;
    margin-right:15/35rem;
}
.head_buluo{
    height:40/35rem;
    margin:0/35rem;
    background:#ffffff;
    border-bottom: 5/35rem solid #f0f0f0;
}
.head_buluo img{
    margin-top: 6/35rem;

}
.head_buluo .el-icon-arrow-right{
    margin-top: 10/35rem;
    float:right;
}
.head_buluo_tou{
    position:relative;
    margin-top:-10/35rem;
    width:100%;
     border-bottom: 5/35rem solid #f0f0f0;
}
.head_buluo_tou img{
    position: absolute;
    margin-top:-3/35rem;
    float:left;
    width:40/35rem;
    border-radius: 30/35rem;
    margin-left:30/35rem;
}
.head_buluo_tou span {
    margin-left:80/35rem;
     margin-top:-10/35rem;
}
.head_buluo_tou p{
    margin-left:80/35rem;
     margin-top:-2/35rem;
}
.head_buluo_img img{
    margin-left:83/35rem;
}
.hui{
    width:100%;
    background:#f0f0f0;
    
}

</style>